import React from 'react';
import { List,DatePicker,Toast } from 'antd-mobile'
import { postEnterTime } from '../common/service'
import { connect } from 'react-redux';

import { saveData } from '../action/UserAction'
import NoPowerShow from '../component/NoPowerShow';
class InitConstruction extends React.Component {
	constructor(props){
		super(props);
		const preparation = this.props.userReducer.step.preparation;
		this.state = {
			enterDate: preparation ? preparation.approachDate : new Date(),  //进场时间
			enterAddress: preparation ? preparation.approachPath : '',      //进场路线
			preparationId: preparation ? preparation.preparationId : null   // 准备id
		}
	}
	
	commit() {
		const { showLoadModal, hideLoadModal } = this.props;
		if (this.state.enterAddress.trim().length === 0) {
			Toast.info('进场路线不能为空', 2);
			return;
		}
		showLoadModal();
		postEnterTime({
			approachDate: this.state.enterDate,
			approachPath: this.state.enterAddress,
			flowId: this.props.userReducer.flowId,  //流程id
			preparationId: this.state.preparationId
		})
		.then((data) => {
			const isOk = data.data;
			hideLoadModal();
			console.log(isOk);
			if (isOk.success) {
				this.props.dispatch(saveData(isOk.obj))
				this.props.currentPage(isOk.obj.flowBaseInfo.flowProcesses)
			} else {
				Toast.info(isOk.msg, 2);
			}
		})
		.catch((e) => {
			hideLoadModal();
			console.log(e);
			Toast.info('服务器异常', 2);
		})
	}

	render() {
		//判断是不是当前节点
		if (this.props.currentObj.flowId !== 2 || -1 === this.props.userReducer.roles.findIndex((value) => value === 51)) {
			return (<NoPowerShow id={this.props.currentObj.flowId}></NoPowerShow>);
		}
		return (
			<div style={{padding: '1.42rem 0.2rem 0rem 0.2rem'}}>
				<p className='init-construction-title'>进场时间</p>
				<DatePicker
					mode={'datetime'}
          value={new Date(this.state.enterDate)}
          onChange={date => this.setState({ enterDate: date })}
        >
          <List.Item arrow="horizontal"></List.Item>
        </DatePicker>
				<p className='init-construction-title'>进场路线</p>
				<textarea 
					 className='init-coonstruction-address'
					 placeholder='请输入...'
					 value={this.state.enterAddress}
					 onChange={(e)=>this.setState({enterAddress: e.target.value})}
				 ></textarea>
				{ -1 === this.props.userReducer.roles.findIndex((value) => value === 52) || 
					!this.props.isTodayStep() ? null :
					<div
						id='initCommmitBtn'
						className='ConstructionEditBtn'
						onTouchStart={()=>{document.getElementById('initCommmitBtn').style.backgroundColor = '#D97442'}}
						onTouchEnd={()=>{document.getElementById('initCommmitBtn').style.backgroundColor = '#FFA24A'}}
						onClick={()=>{
							this.commit()
						}}
						>
						提交
					</div>
				}
			</div>
		);
	}
}

function mapStateToProps(state) {
  const { userReducer } = state;
  return {
    userReducer
  };
}

export default connect(mapStateToProps)(InitConstruction);
